<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #title{
            color: red;
            font-weight: bold;
        }
        ul{
            border: 1px solid cornflowerblue;
            list-style: none;
            padding: 10px;
            width: 360px;
        }
        ul li{
            line-height: 40px;
            border: 1px solid cornflowerblue;
            padding: 10px 10px;
            margin-bottom: 10px;
        }
    </style>
</head>
<body>
<ul>
    <li id="title">问卷调查：你最喜欢歌手是谁？</li>
    <li>
        <input type="radio" name="select" id="selectAll">全选
        <input type="radio" name="select" id="unSelectAll">全不选
        <input type="radio" name="select" id="return">反选
    </li>
    <li>
        <input type="checkbox" name="songer">刘德华
        <input type="checkbox" name="songer">张学友
        <input type="checkbox" name="songer">孙燕姿
        <input type="checkbox" name="songer">刘欢
    </li>
</ul>
    <script src="scripts/dev/jquery-3.4.1.js"></script>
    <script>
        $(document).ready(function () {
            $('#selectAll').click(function () {
                $('[name *= "songer"]').prop("checked",true);
            });
        });
        $('#unSelectAll').click(function () {
            $('[name *= "songer"]').prop("checked",false);
        });
        $('#return').on('click',function () {
            $('[name *= "songer"]').each(function (index,docEle) {
                $(this).prop("checked",!$(this).prop("checked"));
            });
        });
    </script>
</body>
</html>